<template>
	<view class="border-top">
		<view class="item-list px-2 flex-column pt-2" style="margin-bottom: 120rpx;">
			<view class="item px-25 mb-3" v-for="(item, index) in list" :key="index">
				<view class="flex align-center justify-between py-3">
					<view class="flex">
						<image src="../../static/img/ic_default_head.png" style="width: 64rpx;height: 64rpx;"
							class="rounded-circle mr-2" mode=""></image>
						<view class="font30 font-weight-500">{{ item.parentName }}</view>
					</view>
					<view class="color999 font26">{{ item.applyTime }}</view>
				</view>
				<view class="flex color333 font-weight-500 font32 mb-3 line-h">{{ item.applyTime }}</view>
				<view class="flex color333 font-weight-500 font32 mb-3 line-h">时间：{{ item.leaveTime }}</view>
				<view class="flex color333 font-weight-500 font32 mb-3 flex-wrap">事由：{{item.leaveReason}}</view>
				<view class="flex pb-3 border-bottom" v-if="item.leaveImgList != ''">
					<view class="mx-2" v-for="(items, i) in item.leaveImgList" :key="i">
						<image v-if="Object.keys(items).length!=0" @click="previewImg(items.leaveImg)" @error="error(index,i)" :src="items.leaveImg"
							style="width: 206rpx;height: 146rpx;" class="" mode="aspectFit"></image>
					</view>
				</view>
				<view class="flex py-2">
					<view class="font32 font-weight-500">审批结果：</view>
					<view class="font32 font-weight-500 text-main" v-if="item.replyCode == '1'">
						{{ item.teacherReply == 1 ?  '批准' : '未批准' }}</view>
						<view class="font32 font-weight-500 text-main" v-else>待审批</view>
				</view>
				<view class="flex py-2" v-if="item.teacherReply == '2'&&item.replyCode == '1'">
					<view class="font32 font-weight-500">拒绝理由：</view>
					<view class="font32 font-weight-500 text-main">{{ item.reply }}</view>
				</view>
			</view>
		</view>
		<view class="fixed-bottom px-5 pb-3">
			<main-button @click="toLeave">我要请假</main-button>
		</view>
	</view>
</template>
<script>
	import mainButton from '../../components/common/main-buttom.vue';
	export default {
		components: {
			mainButton
		},
		data() {
			return {
				list: []
			};
		},
		onShow() {
			this.getData();
		},
		methods: {
			previewImg(logourl) {
				let _this = this;
				let imgsArray = [];
				imgsArray[0] = logourl
				uni.previewImage({
					current: 0,
					urls: imgsArray
				});
			},
			error: function(index, i) { //加载图片出现404错误之后用默认图片替换
				this.list[index].leaveImgList[i].leaveImg = '../../static/img/none_img.jpg'; //默认图片路径  
			},
			toLeave() {
				uni.navigateTo({
					url: '../toLeave/toLeave'
				});
			},
			getData() {
				let this_ = this;
				let opts = {
					url: 'Jz/SearchQj.shtml'
				};
				let param = {
					token: uni.getStorageSync('userInfo').token,
					page: 1,
					pageSize: 10000
				};
				this_.$http.httpRequest(opts, param).then(
					res => {
						console.log(res.data);
						if (res.data.code == '200') {
							let data = res.data.data;
							this.list = data.results;
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					},
					error => {
						console.log(error);
					}
				);
			}
		}
	};
</script>

<style>
	.item {
		background: rgba(255, 255, 255, 1);
		box-shadow: 0rpx 3rpx 10rpx 0rpx rgba(64, 64, 64, 0.12);
		border-radius: 20rpx;
	}
</style>
